// base
import Taro, { Component } from '@tarojs/taro'
import { View, Text } from '@tarojs/components'
// less
import './index.less'
import { navigateTo } from '../../../../crossplatform/apiservice/navigate'
import { pagejumplist } from '../../../../configuration/pagejump'
import MessageSelectSingle from '../../../../components/page-components/message-select-single'

class MessageSelectWrap extends Component {
  static defaultProps = {
    dataSource: []
  }
  componentWillMount() {
    // onLoad
  }

  componentDidMount() {
    // onready
  }

  componentDidShow() {
    // onshow
  }

  componentDidHide() {
    // onhide
  }

  componentWillUnmount() {
    // onUnload
  }

  delay(time = 0) {
    return new Promise(resolve => {
      setTimeout(() => {
        resolve()
      }, time)
    })
  }

  onChange = ({ type, value }) => {
    if (type == 'phone') {
      if (value) {
        navigateTo({
          url: `${pagejumplist['phone-validation'].path}?type=changemobilec`
        })
      } else {
        navigateTo({
          url: pagejumplist['phone-validation'].path
        })
      }
    } else {
      this.props.onChange({ type, value })
    }
  }

  render() {
    const yearPre18 = new Date().getFullYear() - 18
    const { value } = this.props
    return (
      <View className="MessageSelectWrap_id07176">
        {this.props.dataSource.map((data, index) => {
          let selectlist = data.selectlist || []
          let val =
            data.type === 'phone' ? data.value : data.value ? data.value.slice(0, 4) : yearPre18
          return (
            <MessageSelectSingle
              mode={data.mode}
              start={data.start}
              end={data.end}
              name={data.name}
              selectlist={selectlist}
              type={data.type}
              value={value || val}
              onChange={this.onChange}
              withoutborder={index === this.props.dataSource.length - 1}
              fields={data.fields || ''}
              className="select-single-item"
            />
          )
        })}
      </View>
    )
  }
}

export default MessageSelectWrap
